<!DOCTYPE html>
<style>
  #host::before { content: "A" }
  #host.block::before { display: block }
</style>
<p>You should see a space between A and B below.</p>
<div id="host" class="block"> </div>
<script>
  host.offsetTop;
  var root = host.attachShadow({mode:"open"});
  root.innerHTML = " <span>B</span>";
  host.className = "";
</script>
